<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML>
<html>
<head>
<base href="<%=basePath %>">
<title>****会员充值管理界面****</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<%-- 引用layui.css --%>
<link rel="stylesheet" type="text/css" href="<%=basePath %>js/layui/css/layui.css" />
<link rel="stylesheet" type="text/css" href="<%=basePath %>css/common.css" />
</head>
<body>
	<div class="ibox">
		<div class="ibox-content bodycss">
			<!-- 表单搜索 开始 -->
		 	<section class="panel panel-padding ">
			<form class="layui-form layui-form-pane form-search"
				onsubmit="return false" method="get">
				<div class="layui-form-item layui-inline">
					<label class="layui-form-label">选择城市</label>
					<div class="layui-input-inline" >
					  <div  style="width:150px">
						<select name="cityName" id="orderState" > <!-- 订单状态：0:已取消;10(默认):待确认;20:已确认;30:已配货;40:已发货;50:已收款;60:已退货 -->
							<option value="">请选择</option>
							<option value="2">潍坊</option>
							<option value="3">郑州</option>
							<option value="10">广州</option>
							<option value="16">省委省政府</option>
							<option value="22">洛阳</option>
							<option value="24">一拖六七八街坊</option>
							<option value="75">信阳</option>
							<option value="76">南阳</option>
							<option value="77">上海</option>
						</select>
                      </div>
					</div>
				</div>
				<div class="layui-form-item layui-inline">
					<button class="layui-btn layui-btn-primary" lay-submit lay-filter="seach">
						<i class="layui-icon"></i> 搜 索
					</button>
				</div>
			</form>
			</section>
			<!-- 表单搜索 结束 -->
			<section class="panel panel-padding ">
			<table class="layui-table"
				lay-data="{
	                        id: 'menuTeble',
	                        width:'auto',
	                        url:'member/querryMember.do',
	                        page:true,
	                        even:true,
	                        skin:'row',
	                        limits:[10,20,30,40,50],
	                        limit:10,
							method:'post'                      
	                        }"
				lay-filter="popedomLay" id = "dataTable">
				<thead>
					<tr>
						<th lay-data="{checkbox:true,disabledKey:'check_status',disabledKeyValue:'1,2'}"></th>
						<th lay-data="{field:'user_id', width:100}">序号</th>
						<th lay-data="{field:'user_name', width:100,align:'center'}">会员名称</th>
						<th lay-data="{field:'user_phone', width:100,align:'center'}">会员电话</th>
						<th lay-data="{field:'user_card_number', width:200,align:'center'}">会员卡号</th>
						<th lay-data="{field:'statu', width:120,align:'center',templet:'#m_type'}">会员状态</th>
						<th lay-data="{field:'user_integral', width:200,align:'center'}">积分</th>
						<th lay-data="{field:'user_balance', width:200,align:'center'}">余额</th>
						<th lay-data="{field:'create_time', width:200,align:'center'}">创建时间</th>
						<th lay-data="{fixed: 'right', width:350, align:'center', toolbar: '#popedomBar'}">操作</th>
					</tr>
				</thead>
			</table>
			</section>
		</div>
	</div>
	
	<!-- 充值的表单的方法 -->
	<div id ="recharge" style = "display:none;">
			<form class="layui-form" style="margin:30px;" method="post" >
				<div class="layui-form-item">
					<label class="layui-form-label">会员的ID编号</label>
					<div class="layui-input-block">
						<input type="text" name="member_id" required  id = "member_id"
							 autocomplete="off" class="layui-input"/>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">会员的名称</label>
					<div class="layui-input-block">
						<input type="text" name="member_name" required  id = "member_name"
							 autocomplete="off" class="layui-input"/>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">充值的金额</label>
					<div class="layui-input-block">
						<input type="text" name="member_money" required  id = "member_money"
							 autocomplete="off" class="layui-input"/>
					</div>
				</div>
				<!-- 添加的弹出框的两个按钮 -->
				<div class="layui-form-item">
					<div class="layui-input-block">
						<button class="layui-btn" lay-submit lay-filter="rechargeSubmit" type = "submit">充值</button>
						<button type="reset" class="layui-btn layui-btn-primary">重置</button>
					</div>
				</div>
			</form>
		</div>
	
	
	<script type="text/html" id="m_type">	
	    {{#  if(d.statu == "0") {  }}
			<font color="#000000">不正常</font>
		{{#  } else if(d.statu == "1") {  }}
			<font color="#00ff00">正常</font>
		{{#  }  }}
    </script>
	<script type="text/html" id="popedomBar">
			<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="recharge" >会员充值</a>
    </script>
    <script type="text/javascript" src="<%=basePath%>js/layui/layui.js"></script>
	<script type="text/javascript">
	layui.config({ base: "<%=basePath%>/js/common/"}).use(["common", "element", "layer", "form", "table", "jquery"], function(){
			var elem = layui.element;
			var layer = layui.layer;
			var form = layui.form;
			var table = layui.table;
			var $ = layui.jquery;
			layui.common.init();			
			/**
			 * 监听刷新表格
			 */
			form.on('submit(seach)', function(data){
				layer.msg(JSON.stringify(data.field));
				table.reload('menuTeble', {
					where: data.field,//这个地方式设置的是表格执行重载的时候传递的参数
				});
				return false;
			});
			
			//监听表格事件
			table.on('tool(popedomLay)',function(tableData){
				var tdata = tableData.data; 
				var tr = tableData.tr;
            	//首先是监听的是事件
            	var event = tableData.event;
				var memberid = tdata.user_id;
				if(event == "recharge"){
					//将值传到弹出的表单中去
					$("#member_id").val(tdata.user_id);
					$("#member_name").val(tdata.user_name);
					//打开弹出框
					layer.open({
						type : 1,
            			title : "修改菜单信息的表单",
            			content : $("#recharge"),
            			area : ['700px','300px'],
            			anim : 5,
						isOutAnim: true,
	                    maxmin: true,
	                    resize: false,
	                    moveOut: true,
	                    zIndex: 99999	
					})
				}
			})
			//监听表单的提交的事件
			form.on('submit(rechargeSubmit)',function(data){
				$.ajax({
					type : "post",
					url : "member/rechargeMethod.do",
					data : data.field,
					dataType : "json",
					async:false,
					success: function(data){
						//判断传回来的数据
						if(data.satausCode == 200){
						 	layer.msg(data.message,{icon : 6});
						 	table.reload('menuTeble',{
								where : data.field
							})
						 }else{
							layer.msg(data.message,{icon : 8});							 
					  }
				 }
			})
		})
	});
</script>
</body>
</html>
